.chub_detail{
  .title{
    .bg;
    padding: @spaceV @space @spaceV/2;
    h2{
      font-weight: bold;
      .font(16px);
    }
    .user{
      .flex;
      padding: 8px 0;
      color: @grey;
      .portrait{
        .circle(40px);
        .img{
          .br(50%);
        }
      }
      p{
        flex: 1;
        margin: 0 5px;
        color: @blue;
      }
    }
    .tags{
      ul{
        .oh;
      }
      li{
        float: left;
        padding: 1px 10px;
        color: @grey;
        .br(4px);
        margin: 0 @spaceV @spaceV/2 0;
      }
    }
  }
  .review{
    .bg(lighten(@grey, 35%));
    padding: @spaceV @space*2;
    &>ul>li{
      .flex(@v: flex-start);
      line-height: 20px;
      margin: 8px 0;
      .left{
        width: 70px;
        font-weight: bold;
      }
      .right{
        flex: 1;
        ul{
          .oh;
          li{
            float: left;
            margin-right: 6px;
          }
        }
        [class^="score"]{
            color: lighten(@grey, 10%);
        }
        .score(5);
        .score(@n, @i: 1) when (@i =< @n) {
          .score_@{i} {
            li:nth-child(-n+@{i}){
              color: @black;
            }
          }
          .score(@n, (@i+1));
        }
      }
    }
  }
  .con{
    .bg;
    padding: @spaceV @space;
  }
  .view{
    .bg;
    padding: @spaceV @space;
    color: @grey;
    .flex(@h: flex-start);
    div:nth-child(-n+2){
      margin-right: 5px;
    }
  }
  .share-tip{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    padding: 20px;
    box-sizing: border-box;
    background: rgba(0,0,0,.6);
    z-index: 100;
    div{
      height: 100%;
      background: url('@{img}ico-share-wechat.png') no-repeat right 0;
      .bgSize(240px);
    }
  }
}